<template>
  <div>
    <el-button @click="$router.back()">返回</el-button>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span style="font-size: 20px">基本信息</span>
      </div>
      <el-descriptions>
        <el-descriptions-item label="运输任务编号：">{{
            form.id
          }}</el-descriptions-item>
        <el-descriptions-item label="车牌号码：">{{
            form.licensePlate
          }}</el-descriptions-item>
        <el-descriptions-item label="起始地机构：">{{
            form.startAgencyName
          }}</el-descriptions-item>
        <el-descriptions-item label="目的地机构：">{{
            form.endAgencyName
          }}</el-descriptions-item>
        <el-descriptions-item label="出车时间：">{{
            form.outStorageTime
          }}</el-descriptions-item>
        <el-descriptions-item label="回车时间：">{{
            form.intoStorageTime
          }}</el-descriptions-item>
        <el-descriptions-item label="司机：">{{
            form.driverName
          }}</el-descriptions-item>
      </el-descriptions>
    </el-card>
    <el-card class="box-card" style="margin-top: 20px">
      <div slot="header" class="clearfix">
        <span style="font-size: 20px">异常信息</span>
      </div>
      <el-descriptions>
        <el-descriptions-item label="车辆故障：">{{
            form.isFault
          }}</el-descriptions-item>
        <el-descriptions-item label="车辆违章：">{{
            form.isBreakRules
          }}</el-descriptions-item>
        <el-descriptions-item label="车辆事故：">{{
            form.isAccident
          }}</el-descriptions-item>
      </el-descriptions>
    </el-card>
  </div>
</template>

<script>
import { getTruckReturnDetailApi } from "@/api/register";
export default {
  data() {
    return {
      form: {
        id: 0,
        licensePlate: 0,
        startAgencyName: "",
        endAgencyName: "",
        outStorageTime: "",
        intoStorageTime: "",
        driverName: "",
        isFault: "",
        isBreakRules: "",
        isAccident: "",
      },
    };
  },
  created() {
    this.getTruckReturnDetail();
  },
  methods: {
    //回车登记详情
    async getTruckReturnDetail() {
      // console.log(this.$route);
      const res = await getTruckReturnDetailApi(this.$route.params.id);
      console.log(res);
      if (res.data.isFault) {
        res.data.isFault = "是";
      } else {
        res.data.isFault = "否";
      }
      if (res.data.isBreakRules) {
        res.data.isBreakRules = "是";
      } else {
        res.data.isBreakRules = "否";
      }
      if (res.data.isAccident) {
        res.data.isAccident = "是";
      } else {
        res.data.isAccident = "否";
      }
      this.form = res.data;
    },
  },
};
</script>

<style lang="scss" scoped>
.el-card__header {
  padding: 18px 40px;
}
</style>
